<template>
	<view class="service_img" @click.stop="link">
		<image style="width: 50rpx;height: 50rpx;" src="@/static/images/server/kefu.png" mode=""></image>
		<text>{{ $t('客服') }}</text>
	</view>
</template>

<script>
import { createC2CConversation } from "@/common/public"
	export default {
		data() {
			return {
				customer: '',
				lang: getApp().globalData.lang,
			};
		},
		mounted() {
			this.$onLaunched;
			if(this.lang==='zh'){
				this.customer = getApp().globalData.site.im_customer001
			}else{
				this.customer = getApp().globalData.site.im_customer002
			}
		},
		methods: {
			link(){
				createC2CConversation(this.customer, this,true)
			}
		}, 
	}
</script>

<style lang="scss" scoped>
.service_img{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 150rpx;
	height: 150rpx;
	border-radius: 50%;
	background-color: white;
	position: fixed;
	z-index: 2000;
	right: 2%;
	top: 73%;
	border: 2rpx solid #dcdada;
	box-sizing: border-box;
	// box-shadow: 2px 2px 2px #E5E5E5, -1px -1px 1px #E5E5E5; // 给多个边框添加阴影效果 ，四个边框都有阴影
	box-shadow: 6rpx 8rpx 12rpx  rgba(196, 196, 198, 0.9);
	text{
		text-align: center;
		background-image: linear-gradient(134deg, #DE2D11 0%, #FDB22F 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
		font-size: 24rpx;
		word-break: break-all;
	}
	// opacity: .8;
}
</style>
